<template>
  <VDialog
    @close="handleClose"
    :loading="loading"
    :disabled="true"
    title="详情"
  >
    <template #content>
      <div v-for="(item, key) in titleFild" :key="item">
        <div>
          <span class="text-[var(--base-sub-text-color)]">{{ key }}</span> :
          <span class="text-[var(--base-text-color)]">{{ data?.[item] || "-" }}</span>
        </div>
      </div>
    </template>
  </VDialog>
</template>
<script setup>
const props = defineProps({
  data: { type: Object, default: () => {} },
});
const titleFild = {
  fee: "fee",
  fee_currency: "feeCurrency",
  payment_description: "paymentDescription",
  amount_charged: "amountCharged",
  amount_charged_currency: "amountChargedCurrency",
  payee_id: "payeeId",
  transfer_amount: "transferAmount",
  transfer_amount_currency: "transferAmountCurrency",
  transfer_fx_rate: "transferFxRate",
  transfer_source_currency: "transferSourceCurrency",
  transfer_target_currency: "transferTargetCurrency",
  payment_reference: "paymentReference",
  recipient_name: "recipientName",
  recipient_email: "recipientEmail",
  batch_id: "batchId",
  payment_date: "paymentDate",
  receiving_account_id: "receivingAccountId",
  beneficiary: "beneficiary",
  note: "note",
  source_address_line_1: "sourceAddressLine1",
  source_address_line_2: "sourceAddressLine2",
  source_city: "sourceCity",
  source_state: "sourceState",
  source_country: "sourceCountry",
  source_zip_code: "sourceZipCode",
  source_company_name: "sourceCompanyName",
  source_first_name: "sourceFirstName",
  source_last_name: "sourceLastName",
  source_legal_name: "sourceLegalName",
  requested_amount: "requestedAmount",
  requested_amount_currency: "requestedAmountCurrency",
  location_city: "locationCity",
  location_country: "locationCountry",
  authorization_code: "authorizationCode",
  original_transaction_amount: "originalTransactionAmount",
  original_transaction_currency: "originalTransactionCurrency",
  fx_rate: "fxRate",
  decline_reason: "declineReason",
  source_currency: "sourceCurrency",
  target_currency: "targetCurrency",
};
const emit = defineEmits(["update:modelValue", "close", "refresh"]);
const handleClose = async (refresh) => {
  emit("update:modelValue", false);
  emit("close");
  if (refresh) emit("refresh");
};
</script>
